<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>动态网页</title>
    <style type="text/css">
        * {
            margin: 0;
            padding: 0;
        }

        #nbapiay {
            width: 250px;
            margin: auto;
        }

        #curry,
        #abc {
            height: 178px;
            width: 112px;
            border: rgba(0,0,0, 0.12)solid 1px;
            float: left;
            margin: 5px;
        }
        .teamImg{
            width: 16px;
            height: 16px;
        }
        #curryImg,#curry, #abcImg,#abc{
            border-radius: 10px;
            text-align: center;
        }
        .name{
            font-size: 14px;
        }
        .type,.team{
            font-size: 12px;
            color: #70757a;
        }
     
    </style>
</head>

<body>
        <p align="center"> &copy; 版权由卢诚信归属，未经允许不得复制、镜像</p>
    <div id="nbapiay">
        <div id="curry">
            <img src="" alt="curry img" id="curryImg">
            <br>
            <span class="name"></span><br>
            <span class="type"></span><br>
            <img src="" alt="" class="teamImg">
            <span class="team"></span>
        </div>
        <div id="abc">
            <img src="" alt="abc img" id="abcImg">
            <br>
            <span class="name"></span><br>
            <span class="type"></span><br>
            <img src="" alt="" class="teamImg">
            <span class="team"></span>
        </div>
    </div>
    <hr>
    <script>
        function Star(name,type,team,personImg,teamImg){
            this.name=name;
            this.type=type;
            this.team=team;
            this.personImg=personImg;
            this.teamImg=teamImg;
        }
        var curry =new Star('curry','控球后卫','金州勇士','curryImg.jpg','curryTeamImg.png');
        var curryImgItem =document.getElementById('curryImg');
        curryImgItem.src=curry.personImg;

        var curryName = document.getElementsByClassName('name');

 var curryName =curryName[0];

 curryName.innerHTML=curry.name;

 var typeArr  =document.getElementsByClassName('type');
 var curryType =typeArr[0];
  curryType .innerHTML=curry.type;

  var teamImgArr =document.getElementsByClassName('teamImg');
  var curryTeamImg =teamImgArr[0];
  curryTeamImg.src=curry.teamImg;

  var teamArr =document.getElementsByClassName('team');
  var curryTeam =teamArr[0];
  curryTeam.innerHTML =curry.team;
        
  var abc =new Star('abc','前锋','密尔沃基雄鹿','abcImg.jpg','abcTeamImg.png');
        var abcImgItem =document.getElementById('abcImg');
        abcImgItem.src=abc.personImg;

        var abcName = document.getElementsByClassName('name');

 var abcName =abcName[1];

 abcName.innerHTML=abc.name;

 var typeArr  =document.getElementsByClassName('type');
 var abcType =typeArr[1];
  abcType .innerHTML=abc.type;

  var teamImgArr =document.getElementsByClassName('teamImg');
  var abcTeamImg =teamImgArr[1];
  abcTeamImg.src=abc.teamImg;

  var teamArr =document.getElementsByClassName('team');
  var abcTeam =teamArr[1];
  abcTeam.innerHTML =abc.team;   
    </script>
</body>

</html>